<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
  <title>Facebook XFBML Test console</title>
  <link rel="stylesheet" href="http://static.ak.connect.facebook.com/css/fb_connect.css" type="text/css" />
</head>
<body>

  <p>Use the this button to connect
  <fb:login-button>
  </fb:login-button>
  </p>

  <p id="have_session_text" style=" visibility:hidden;">You have a facebook session. to clear session to session-less result, click on this button
  <input type="button" onclick="clearSession()" value="clear session"/>
  <p>Note: this feature does not quite work yet :-).</p>
  </p>
  <p id="no_session_text">You don't have a session yet. Please be aware that not all XFBML will render when session is available.</p>
  <input type="button" value="Render XFBML" onclick="render_xfbml()" />
  <p>XFBML input. Place your XFBML markup here and click the render button to render them</p>

  <textarea id="xfbml_input" style="width:80%; height:40%;"  rows="10">
 <fb:profile-pic uid="1160" facebook-logo="true" linked="false">
        </fb:profile-pic>

        <fb:profile-pic uid="9074" facebook-logo="false" size="thumb">
        </fb:profile-pic>
        <fb:profile-pic uid="4800348" size="small">
        </fb:profile-pic>
        <fb:profile-pic uid="4801660" size="small">
        </fb:profile-pic>
        <fb:profile-pic uid="711562108" size="pic_square" shownetwork="true">
        </fb:profile-pic>
        <fb:profile-pic uid="10186796166" size="pic_square" shownetwork="true">
        </fb:profile-pic>
  </textarea>

  <p>XFBML output</p>
  <div id="xfml_output" style=" border:solid 1px black;">

  </div>

  <p>Test debug level</p>
  <input id="debugLevel" value="0" type="text" />

  <span>enable</span><input id="enableDebug" type="checkbox" />
  <input id="updateDebug" value="Update Debug setting" type="button" onclick="updateDebugLevel()" />
  <p>Debug output</p>
  <textarea id="_traceTextBox" style="width:80%; height:400px;"  rows="10">
  </textarea>

  <script src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php"
    type="text/javascript"></script>

  <script type="text/javascript">
    FB_RequireFeatures(["XFBML"], function()
    {

      FB.Facebook.init("6323912d9e47fa9f64b3580f7c75ccaa", "xd_receiver.htm");
      FB.Facebook.get_sessionState().waitUntilReady(updateSessionState);

      //FB.XFBML.Host.autoParseDomTree = false;
    });

    function $(id)
    {
        return document.getElementById(id);
    }

    function render_xfbml()
    {
        var input = $('xfbml_input');
        var output = $('xfml_output');

        output.innerHTML = "";

        output.innerHTML = input.value;

        FB.XFBML.Host.parseDomTree();

    }

    function updateSessionState(session)
    {
        var has_session = $('have_session_text');
        var no_session = $('no_session_text');
        has_session.style.visibility = session ? 'visible' : 'hidden';
        no_session.style.visibility = !session ? 'visible' : 'hidden';
    }
    function clearSession()
    {
        // Clear session
        FB.Facebook.apiClient.set_session(null);
        updateSessionState(null);
    }

    function updateDebugLevel()
    {
        var level = parseInt($('debugLevel').value);
        var enabled = $('enableDebug').checked;

        FB.FBDebug.isEnabled = enabled;
        FB.FBDebug.logLevel = level;


    }
  </script>

</body>
</html>
